<script>
    module.exports = {
         created: function () {
              this.$on('get-selected-list',(data,event)=>{
                   this.selected_list=data
                   if(event) this.eventName=event
              })
             this.$on('set-selected-status',value=>{
                 this.choose_status=value
             })
        },

        // 组件接受传递属性参数
        //传入自定义eventName防止提交给父组件的时候事件冲突
        props: ['label'],

        data: function(){
            return {

                //选中的订单状态
                choose_status: '',

                eventName:'',

                // 下拉状态list,格式如下{0:'未处理',}
                selected_list: {},
            }
        },

        methods: {
        },

        watch: {
            'choose_status': function(value) {
                if(!this.eventName)  this.eventName='choose-selected-status'
                this.$parent.$emit(this.eventName, value);
            }
        }
    }
</script>


<template>
    <div class="order-status f-fl">
        <dl class='f-fix'>
            <dt class='f-fl'>{{label}}</dt>
            <dd class='f-fl'>
                <select  v-model="choose_status">
                    <option value=''>全部</option>
                    <option v-for="(key,val) in selected_list" :value="key">{{val}}</option>
                </select> 
            </dd>
        </dl>
    </div>
</template>


<style lang="scss"  scoped>
   
    .order-status {
         min-width:160px;
         height:30px;
         margin-top:15px;
         line-height:30px;
         font-size: 14px;
              dt{
                  margin: 0 10px;
              }
                select{
                    width:100px;
                    height:30px;
                    background: #FFFFFF;
                    border: 1px solid #DDDDDD;
                    border-radius: 2px;
                }

    }

</style>
     